<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<% String path=request.getContextPath()+ "/"; String basePath=request.getScheme()+ "://" + request.getServerName() + ":" + request.getServerPort() + path+ "/"; %>
<html >
     <head>
	     <meta http-equiv="Content-Type" content="text/html; charset=GBK"/>
		<link type="text/css" rel="stylesheet" href="<%=path %>css/myzh.safe.css" />
    <title></title>
    </head>
   
  <script type="text/javascript">

     
     /*
     定义对象属性及默认值
     **/
     var stepConObj= [];
           stepConObj.curStepIndex=1;//当前节点位置索引，从1开始
           stepConObj.stepContentArray=["录入","预览","核保","完成"];//初始化缺省节点内容
           stepConObj.stepContentFlag="1";//1代表非见费流程，2代表见费流程
     function stepControl(stepConObj){
    	  if(!!stepConObj){
    		  var curStepIndex=stepConObj.curStepIndex;//当前节点位置索引，从1开始
    		  var stepContentArray="";//节点内容
    		  if(stepConObj.stepContentFlag=="1"){
    			  stepContentArray=["录入","预览","核保","完成"];
    		  }else{
    			  stepContentArray=["录入","预览","核保","支付","完成"];
    		  }
    		  if(parseInt(curStepIndex)>stepContentArray.length){
    			  alert("进度条当前索引值不能大于节点数");
    			  return;
    		  }
    		  var htm="";
    		  var classname="first doing";
    		  for(var i=0;i<stepContentArray.length;i++){
    			   if(curStepIndex>=(i+1)){
    				   classname="first doing";//已完成状态class
    			   }else{
    				   classname="normal";//未完成状态class
    			   }
    			  
    			  if(curStepIndex==stepContentArray.length&&stepContentArray.length==(i+1)){
   				     classname="first doing last";//当前节点是最后一个节点，即完成状态
	   				 htm+='<dl class="'+classname+'">'+
									   '<dt class="s-num">&nbsp;</dt>'+
									   '<dd class="s-text">'+stepContentArray[stepContentArray.length-1]+'</dd>'+
					            '</dl>';
   			      }else if(stepContentArray.length==(i+1)){
   			    	     classname="last";
	   			    	 htm+='<dl class="'+classname+'">'+
				   			    	   '<dt class="s-num">&nbsp;</dt>'+
									   '<dd class="s-text">'+stepContentArray[stepContentArray.length-1]+'</dd>'+
					                '</dl>';
   			      }else{
   			    	 htm+='<dl class="'+classname+'">'+
								   '<dt class="s-num">'+(i+1)+'</dt>'+
								   '<dd class="s-text">'+stepContentArray[i]+'</dd>'+
				                '</dl>';
   			      }
    			  
    		  }
    		 	    $("#sflex04").html(htm);
    		 	 	 var totalWidth=$("#sflex04").width();//进度条总宽度
    		         var dlSize= $("#sflex04").children("dl").size(); //节点数量
    		         var avgWidth=Math.round(totalWidth/(dlSize==0?1:dlSize));//平均长度
    		         $(".stepflex dl").width(avgWidth);//设置每个节点长度
    	  }
     }
     
    </script>
    
<body>
	<div id="sflex04" class="stepflex " >
	</div>
</body>
 </html>